<template>
  <!-- 账号注销 -->
  <div>
    <div class="user-info-title title-ht">
      <span class="tab-item cur">账号注销</span>
    </div>
    <div class="user-info-box r3">
      <div class="r3-1">账号注销后将不能恢复，请慎重考虑！</div>
      <div class="r3-2">
        <el-button type="primary" icon="iconfont icon-user-cancel ft-14" @click="cancelApplyPop">注销</el-button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
    }
  },
  components: {},
  created () {
  },
  methods: {
    cancelApplyPop () {
      this.$confirm('确认要注销账号？', '提示', {
        customClass: 'cancel-pop',
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        center: true,
        confirmButtonClass: 'cancel-btn',
        cancelButtonClass: 'cancel-btn'
      }).then(() => {
        this.cancelApply()
      }).catch(() => {
        this.$message({ type: 'info', message: '已取消注销账号' })
      })
    },
    cancelApply () {
      this.$message({ message: '您的账号注销成功！', type: 'success' })
      this.$store.commit('updateToken')
      this.$router.push('/login')
    }
  }
}
</script>

<style lang="less">
  .cancel-pop{
    font-size: 20px;
    .el-message-box__content{
      font-size: 18px;
      margin-bottom: 10px;
    }
  }
  .cancel-btn{
    width: 80px;
    padding:10px 0;
    margin:0 50px;
  }
</style>